<template>
	<view>
		<uni-notice-bar class="top-notice" show-icon scrollable
			:text="notices.length > 0 ? notices[0].noticeTitle : '暂无通知'" background-color="#f0f9ff" color="#007aff" />
		<view v-for="(notice, index) in notices" :key="index" style="margin: 20rpx; border-radius: 20rpx; background-color:white;">
			<view style="font-weight: 600; margin: 20rpx;">
				<text v-if="!notice.read" class="unread-dot"></text>
				<text style="font-size: 17px;margin-left: 8rpx;">{{ notice.noticeTitle }}</text>
			</view>
			<view>
				<view v-html=" notice.noticeContent"> </view>
				<text style="color: #999;">发布时间{{ notice.createTime }}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		listNotice
	} from '@/api/system/notice.js'
	export default {
		data() {
			return {
				notices: []
			};
		},
		onLoad() {
			this.getListNotice()
		},
		methods: {
			getListNotice() {
				listNotice().then(res => {
					console.log("gg", res.data);
					this.notices = res.data
				})
			},
		}
	};
</script>

<style>
	.unread-dot {
		display: inline-block;
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background-color: red;
		margin-left: 5px;
	}
</style>